<template>
    <div style="display: flex;flex-direction: column;width: 100%;">
    <p class="title-p">
                佳人-群组-申请
        </p>
        <div id="request-box">
            <LIST v-model:listdata="data" @update="load_more"/>
        </div> 

    </div>
   


</template>

<script setup>
import { computed, inject,nextTick,onMounted, ref, watch } from "vue";
import { get_user_room_request } from "@/api/chat/user_behavior.js"
import { noreapeat_array_byId} from "@/static/js/array/concat_two_norepeat"
import LIST from "./list.vue" //为了减少更多自定义导致循环嵌套的开销单独使用list
const chat=inject('chat')()
const data = ref([])
const middledata = computed(() => { 
   return chat.value.get_request_room_data()['data']
})
watch(() => middledata.value, (newV) => {
    data.value = newV
}, {deep:true})
const roomData = {
    // user
    another: 2,
    created_at: "2025-05-08 11:14:24.208523",
    is_active: true,
    one: 1,
    room_id: "ffa5cbd8-a71c-46ca-83ef-bc4ace3b60b5",
    room_type: "double",
    status: 0,
    user_id: 1
};
const roomdata = {
    // 房间
    room_type: "group",
    user_id: 2,
    is_active: true,
    another: null,
    created_at: null,
    one: null,
    room_id: "20debe1a-c56d-46ed-bf0e-e9e0afd1295a",
    status: 0
};

const load_more = async () => {
    const local_info = chat.value.get_request_room_data()
    const local_data_length = local_info?.data?.length
    const current_limit=local_info?.meta?.page || 1
    const total = local_info?.meta?.total   
    if (local_data_length>=total) {
        return 
     }
    const predata = (await get_user_room_request(chat?.value?.get_user_info()?.id, current_limit + 1))
    const noreapeat_data=noreapeat_array_byId(local_info?.data || [] ,predata?.data || [],'room_id')
    chat.value.set_request_room_data('data',noreapeat_data)
    chat.value.set_request_room_data('meta',predata.meta) 
}

onMounted(async () => { 
    if (chat.value.get_request_room_data()?.data != undefined) { 
        data.value = chat.value.get_request_room_data()?.data
    }
    const predata = (await get_user_room_request(chat?.value?.get_user_info()?.id))
    chat.value.set_request_room_data('data', predata.data)
    chat.value.set_request_room_data('meta',predata.meta)
    data.value = predata?.data 
})


</script>

<style  scoped>
#request-box{
    width: 100%;
    height: 100%;
    overflow: visible;
    /* background-color:gold; */
}
#request-box::-webkit-scrollbar{
    display: none;
}

.title-p{
  color:rgba(255, 255, 255, 0.75);
  display: inline-block;
  padding: 4px 14px; 
  border-radius: 12px;
  font-size: 14px;
  font-weight: 600; 
  background-color: #649dff; 
  box-shadow: 0 2px 5px rgba(99, 151, 241, 0.3); 
  text-transform: uppercase; 
  letter-spacing: 0.5px;
  line-height: 1.5;
  transition: all 0.3s ease;
  border: 1px solid transparent; 
}

</style>